.page {
    width: 100vw;
    margin-top: 17px;
    margin-bottom: 5vh;

    .top {
        display: flex;
        justify-content: center;
        width: 100%;
        .content {
            position: relative;
            display: flex;
            align-items: center;
            margin-left: -10px;
            .progress,
            .un_progress {
                z-index: 999;
                width: 20px;
                height: 20px;
                text-align: center;
                background: #85ea9f;
                border: 1px solid #0f0600;
                border-radius: 10px;
                box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.2), inset 0 -2px 0 0 #548f62;
            }
            .un_progress {
                background: #aaa4cb;
                box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.2), inset 0 -2px 0 0 #908ab6;
            }

            .right_progress,
            .un_right_progress {
                width: 40px;
                height: 8px;
                margin-left: -17px;
                background: #bbb5df;
                border: 1px solid #090a10;
                box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.2), inset 0 -3px 0 0 #908ab6;
            }
            .un_right_progress {
                // background: #85ea9f;
            }
        }
        img {
            position: absolute;
            top: 120%;
            left: 7%;
            width: 16px;
            height: 16px;
        }
    }
}
